<!-- 通用头部 -->
<head th:fragment=blogHeader(title,keywords,description,blogConfig) xmlns="http://www.w3.org/1999/html">
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title th:text="${title}"></title>
	<meta name="author" th:content="${blogConfig['oly.web.author']}">
	<meta name="copyright" th:content="${blogConfig['oly.web.copyright']}">
	<meta name="keywords" th:content="${keywords}">
	<meta name="description" th:content="${description}">
	<link rel="shortcut icon" type="image/x-icon" th:href="${#strings.isEmpty(blogConfig['oly.web.ico'])?'/static/zgblog/images/favicon.ico':blogConfig['oly.web.ico']}">
	<link rel="icon" th:href="${#strings.isEmpty(blogConfig['oly.web.ico'])?'/static/zgblog/images/favicon.ico':blogConfig['oly.web.ico']}" >
	<link th:href="@{/static/zgblog/model/layui/css/layui.css}" rel="stylesheet" />
	<link th:href="@{/static/zgblog/model/animate/animate.css}" rel="stylesheet" />
	<link th:href="@{/static/zgblog/model/font-awesome-4.7.0/css/font-awesome.css}" rel="stylesheet" />
	<link th:href="@{/static/zgblog/css/index.css?a=4}" rel="stylesheet" />
	<style type="text/css">
		.layui-btn-bor{
			border: none!important;
		}
		
		.tagcloud {
			width: 100%;
			height: 300px;
			overflow: hidden
		}
		.tagcloud a {
			position: absolute;
			top: 0;
			left: 0;
			display: block;
			padding: 11px 30px;
			color: #333;
			font-size: 16px;
			border: 1px solid #e6e7e8;
			border-radius: 18px;
			background-color: #f2f4f8;
			text-decoration: none;
			white-space: nowrap;
			-o-box-shadow: 6px 4px 8px 0 rgba(151, 142, 136, .34);
			-ms-box-shadow: 6px 4px 8px 0 rgba(151, 142, 136, .34);
			-moz-box-shadow: 6px 4px 8px 0 rgba(151, 142, 136, .34);
			-webkit-box-shadow: 6px 4px 8px 0 rgba(151, 142, 136, .34);
			box-shadow: 6px 4px 8px 0 rgba(151, 142, 136, .34);
			-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4,Direction=135, Color='#000000')";
			/*兼容ie7/8*/
			filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=125, Strength=9);
			/*strength是阴影大小，direction是阴影方位，单位为度，可以为负数，color是阴影颜色 （尽量使用数字）使用IE滤镜实现盒子阴影的盒子必须是行元素或以行元素显示（block或inline-block;）*/
		}

		.tagcloud a:hover {
			color: #3385cf;
		}
        
		/* 防止克隆节点部分显示 */
		.Zebra_Pin_Clone .tagcloud a{
			visibility: hidden;
		}
	</style>
</head>

<!-- 重置css -->
<div th:fragment="blog_reset_css">
	<link th:href="@{/static/zgblog/css/reset.css?v=5}" rel="stylesheet" />
</div>

<!-- 通用JS -->
<div th:fragment="blog_footer_js">
	<script th:src="@{/static/zgblog/model/layui/layui.js}"></script>
	<script th:src="@{/static/zgblog/model/headroom/headroom.js}"></script>
	<script th:src="@{/static/zgblog/model/couldtag/js/jquery-2.1.1.min.js}"></script>
	<script th:src="@{/static/zgblog/js/tagcloud.js}"></script>
	<script th:src="@{/static/zgblog/js/zebra_pin.min.js}"></script>
	<script th:src="@{/static/zgblog/js/jquery.marquee.min.js}"></script>
	<script th:inline="JavaScript">
		var ctx = [[@{/}]];
		$(document).ready(function () {
			layui.use(['element', 'util'], function () {
				var element = layui.element, util = layui.util; //导航的hover效果、二级菜单等功能，需要依赖element模块
				//固定Bar
				util.fixbar({
					showHeight: 60
					, css: function () {
						return { bottom: 75 }
					}()
				});
			});
				/*3D标签云*/
					tagcloud({
						selector: ".tagcloud", //元素选择器
						fontsize: 16, //基本字体大小, 单位px
						radius: 100, //滚动半径, 单位px
						mspeed: "normal", //滚动最大速度, 取值: slow, normal(默认), fast
						ispeed: "normal", //滚动初速度, 取值: slow, normal(默认), fast
						direction: 135, //初始滚动方向, 取值角度(顺时针360): 0对应top, 90对应left, 135对应right-bottom(默认)...
						keep: false, //鼠标移出组件后是否继续随鼠标滚动, 取值: false, true(默认) 对应 减速至初速度滚动, 随鼠标滚动
					    active:true
					});
		
	
		$(".side_con>li").mousemove(function () {
			$(".side_con>li").removeClass("on");
			$(this).addClass("on");
		});
		
		
			$('.marquee').marquee({
				//duration in milliseconds of the marquee
				duration: 15000,
				//gap in pixels between the tickers
				gap: 50,
				//time in milliseconds before the marquee will start animating
				delayBeforeStart: 0,
				//'left' or 'right'
				direction: 'left',
				//true or false - should the marquee be duplicated to show an effect of continues flow
				duplicated: true
			});
		
		var elem = document.querySelector("nav");
		var headroom = new Headroom(elem, {
			"tolerance": 5,
			"offset": 205,
			"classes": {
				"initial": "animated",
				"pinned": "slideInDown",
				"unpinned": "slideOutUp"
			}
		});
	
		new $.Zebra_Pin($('.zgblog-right-box'), {
            contain: true
        });
		headroom.init();
		});
	</script>
	<th:block th:utext="${blogConfig['oly.web.countCode']}"></th:block>
</div>

<!-- 导航 -->
<div th:fragment=blogMainColumn()>
  <div class="blog-nav-box"
		th:with="columns=${@columnTag.getColumnTreeById(@configTag.getKey('zgblog','oly.web.theme.zgblog.column.main'))}">
		<!-- 主导航 桌面端-->
		<nav style="position: fixed; width: 100%; z-index: 10004;" class="zgblog-nav">
			<!-- 主导航  居中-->
			<ul class="layui-nav" style="text-align: center;padding: 0 40px;">
				<!-- 导航logo -->
				<li class="layui-nav-item zgblog-nav-logo">
					<div>
						<a th:href="${blogConfig['oly.web.domain']==''? '/zgblog':blogConfig['oly.web.domain']}"
							class="navbar-logo">
							<img th:if="${!#strings.isEmpty(blogConfig['oly.web.logo'])}"
								th:src="${blogConfig['oly.web.logo']}" th:alt="${blogConfig['oly.web.title']}" />
							<span th:if="${#strings.isEmpty(blogConfig['oly.web.logo'])}"
								th:text="${blogConfig['oly.web.title']}"></span>
						</a>
					</div>
				</li>

				<!-- 导航菜单 -->
				<li class="layui-nav-item" th:each="column: ${columns.childList}">
					<a th:href="${#strings.isEmpty(column.columnUrl)?'javascript:void(0)':blogConfig['oly.web.domain']+column.columnUrl}"
						th:text="${column.columnName}">最新活动</a>
					<dl th:if="${!#lists.isEmpty(column.childList)}" class="layui-nav-child">
						<dd th:each="columnChild: ${column.childList}">
							<a th:href="${blogConfig['oly.web.domain']+columnChild.columnUrl}" th:text="${columnChild.columnName}">选项1</a>
						</dd>
					</dl>
				</li>

				<!-- 导航工具 -->
				<li class="layui-nav-item zgblog-nav-tool" style="float: right;">
					<div class="layui-btn-group">
						<button type="button" class="layui-btn layui-btn-primary layui-btn-sm zgblog-aside-button">
							<i class="layui-icon layui-icon-more"></i>
						</button>
					</div>
				</li>

					<li sec:authorize="isAuthenticated()" class="layui-nav-item" lay-unselect="" style="float: right;"
						th:with="user=${@userTag.getLoginUser()}">
						<a href="javascript:;"><img
								th:src="(${user.avatar} == '') ? @{/img/profile.jpg} : @{${user.avatar}}"
								class="layui-nav-img">
							<shiro:principal property="userName" />
						</a>
						<input id="userId" type="hidden" th:value="${user.userId}" />
						<dl class="layui-nav-child">
							<dd><a th:href="@{/zgblog/perfonal}">个人中心</a></dd>
							<dd><a th:href="@{/logout?themeName=zgblog}">退了</a></dd>
						</dl>
					</li>
					<li sec:authorize="isAnonymous()" class="layui-nav-item" lay-unselect="" style="float: right;">
						<input id="userId" type="hidden" th:value="''" />
						<a th:href="@{/zgblog/login}"><i class="fa fa-sign-in" aria-hidden="true"></i> </a>
					</li>
			</ul>
		</nav>

		<!-- 侧边导航 -->
		<aside>
			<ul class="layui-nav layui-nav-tree layui-nav-side zgblog-nav-aside animated"
				style="text-align: center; margin-top: 60px; width: 100%; z-index: 10000;">
				<li sec:authorize="isAuthenticated()" class="layui-nav-item" lay-unselect="" th:with="user=${@userTag.getLoginUser()}">
						<a href="javascript:;"><img
								th:src="(${user.avatar} == '') ? @{/img/profile.jpg} : @{${user.avatar}}"
								class="layui-nav-img">
							<shiro:principal property="userName" />
						</a>
						<dl class="layui-nav-child">
							<dd><a th:href="@{/zgblog/perfonal}">个人中心</a></dd>
							<dd><a th:href="@{/logout?themeName=zgblog}">退了</a></dd>
						</dl>
					</li>
					<li sec:authorize="isAnonymous()" class="layui-nav-item">
						<a th:href="@{/zgblog/login}"><i class="fa fa-sign-in" aria-hidden="true"></i> </a>
					</li>
				<!-- 导航菜单 -->
				<li class="layui-nav-item" th:each="column: ${columns.childList}">
					<a th:href="${#strings.isEmpty(column.columnUrl)?'javascript:void(0)':blogConfig['oly.web.domain']+column.columnUrl}"
						th:text="${column.columnName}">最新活动</a>
					<dl th:if="${!#lists.isEmpty(column.childList)}" class="layui-nav-child">
						<dd th:each="columnChild: ${column.childList}">
							<a th:href="${blogConfig['oly.web.domain']+columnChild.columnUrl}" th:text="${columnChild.columnName}">选项1</a>
						</dd>
					</dl>
				</li>
			</ul>
		</aside>
	</div>
</div>

<!--文章排行 纯文本-->
<div th:fragment=blogArticleSortText(articles)>
	<ul class="zgblog-tab-list" th:each="article:${articles}">
		<li><a th:title="${article.articleTitle}"
				th:href="${blogConfig['oly.web.domain']+'/article/'+article.articleId}"><i
					class="layui-icon layui-icon-right"></i> <span
					th:text="${article.articleTitle}">为什么程序媛比程序猿写的代码更好？</span></a></li>
	</ul>
</div>

<!--文章排行 带图片-->
<div th:fragment=blogArticleSortImg(articles)>
	<ul class="sidebar_content side_con">
		<li th:each="article,articleStatus:${articles}" th:class="${articleStatus.index!=1}?'':'on'">
			<a th:href="${blogConfig['oly.web.domain']+'/article/'+article.articleId}" th:title="${article.articleTitle}"
				target="_blank">
				<div class="hotcom-img"
					th:with="imgs=${@commonTag.split(article.articleImg==null?'':article.articleImg)},rando=${#numbers.formatDecimal(T(java.lang.Math).floor(T(java.lang.Math).random()*10),1,0)},iul=@{/static/zgblog/images/thumbs/}">
					<img th:src="${(imgs==null)?iul+rando+'.jpg':imgs[0]}" th:alt="${article.articleTitle}">
				</div>
				<div class="hotcom-left">
					<div class="hot-com-title">
						<span th:class="${'num'+(articleStatus.index+1)}" th:text="${articleStatus.index+1}">1</span>
						<apan th:text="${article.articleTitle}">谷歌暂停与华为部分业务合作,华为:中国市场不受影响</apan>
					</div>
					<div class="hot-com-clock">阅读：<span th:text="${article.articleCount.articleLook}">511</span></div>
				</div>
			</a>
		</li>
	</ul>
</div>

<!--底部信息-->
<div th:fragment=blogBottom>
	<footer>
		<div class="layui-row">
			<!-- 友情链接 -->
			<div class="layui-col-md12 zgblog-footer-other">
				<ul id="link-home">
					<li th:each="link:${@linkTag.listLink(0,0)}"><a th:href="${link.linkUrl}"
							target="_blank" th:title="${link.linkName}"><img th:src="${link.linkIco}"
								th:alt="${link.linkName}" />
							<span th:text="${link.linkName}">叶天冬博客</span></a></li>
				</ul>
			</div>
			<!-- 备案信息|网站信息 -->
			<div class="layui-col-md12 zgblog-footer-copyright">
				<div>
					<span th:utext="${blogConfig['oly.web.footer']}">湘ICP备18005863号-1</span>@<span
						th:text="${#dates.format(new java.util.Date().getTime(), 'yyyy')}">|©2019</span>
					<a th:href="${blogConfig['oly.web.domain']}" th:text="${blogConfig['oly.web.author']}"></a> 版权所有
				</div>
			</div>
		</div>
	</footer>
</div>

<!-- 首页 文章列表 -->
<div th:fragment=blogArticles(articles)>
	<div class="layui-row">
		<!-- 文章列表 -->
		<th:block th:include="zgblog/blog_include::blogItemArticle(articles=${articles.rows})" />
		<div class="layui-col-md12 zgblog-post-page" style=" text-align: center;" th:if="${articles.total>0}">
			<div class="layui-box layui-laypage layui-laypage-default">
				<a href="javascript:void(0)" class="page-this">1</a>
				<a href="javascript:void(0)" th:if="${articles.total>18&&articles.total<73}"
					th:each="i:${#numbers.sequence(2,articles.total%18==0?(articles.total/18):(articles.total/18+1))}"
					th:text="${i}"></a>
				<a href="javascript:void(0)" th:if="${articles.total>72}" th:each="i:${#numbers.sequence(2,4)}"
					th:text="${i}"></a>
			</div>
		</div>
	</div>
</div>

<!-- 文章展示 -->
<div th:fragment=blogArticle(article)>
	<div class="layui-row" th:with="article=${article}">
		<div class="layui-col-md12 zgblog-box">
			<article class="zgblog-post-box" style="background-color: white">
				<input id="articleId" th:value="${article.articleId}" type="hidden">
				<div class="layui-row">
					<div class="layui-col-md12 post-heard">
						<header>
							<h1 class="post-title">
								<a th:href="${blogConfig['oly.web.domain']+'/article/'+article.articleId}"
									th:title="${article.articleTitle}" th:text="${article.articleTitle}">php mb_strpos()php
									mb_strpos()函数详解php mb_strpos()函数详解函数详解</a>
							</h1>
							<br>
							<span class="post-read-reduce">
								<span class="layui-badge layui-bg-green"
									th:text="${#strings.isEmpty(article.reprintUrl)?'原':'转'}"></span>
								<i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;<span
									th:text="${#dates.format(article.createTime,'yyyy-MM-dd HH:mm')}">2019-05-14
									13:55</span>
								<i class="fa fa-eye" aria-hidden="true"></i>&nbsp;<span
									th:text="${article.articleCount==null?0:article.articleCount.articleLook}"></span>
								<span class="hidden-xs">&nbsp;
									<i class="fa fa-tags" aria-hidden="true"></i>&nbsp;
									
									<a th:each="category:${article.mapCategory['tag']}" 
										th:href="${blogConfig['oly.web.domain']+'/category/'+category.categoryId}"
										th:title="${category.categoryName}" th:text="${category.categoryName}">个人网站</a> &nbsp;
										<a th:each="category:${article.mapCategory['classify']}"
											th:href="${blogConfig['oly.web.domain']+'/category/'+category.categoryId}"
											th:title="${category.categoryName}" th:text="${category.categoryName}">个人网站</a> &nbsp;

								</span>
							</span>
						</header>
					</div>
					<div class="layui-col-md12 post-content" id="postContent" th:utext="${article.articleContent}">

					</div>
					<div class="layui-col-md12 ">
						<div class="entry-meta">
							<fieldset class="layui-elem-field layui-field-title">
								<legend class="meta-leg">
									<span class="post-like" id="post-like"><i class="layui-icon layui-icon-praise"></i>
									</span>
									<span class="post-award" id="post-award">赏
										<img th:src="${blogConfig['oly.web.shang.zhi']}">
									</span>
									<span class="post-nasty" id="post-nasty"><i class="layui-icon layui-icon-tread"></i>
									</span>
								</legend>
							</fieldset>
						</div>
						<div class="post-suggest">
							<fieldset class="layui-elem-field layui-field-title">
								<legend>文章版权及转载声明</legend>
								<div class="layui-field-box">
									<ul>
										<li class="post-authot"><label>作者：</label><span
												th:text="${blogConfig['oly.web.author']}">zgblog</span></li>
										<li class="post-url"><label>本文地址：</label><a
												th:href="${blogConfig['oly.web.domain']+'/article/'+article.articleId}"
												th:text="${blogConfig['oly.web.domain']+'/article/'+article.articleId}"></a>
										<li class="post-rerint"><label>版权说明：</label><span
												th:text="${blogConfig['oly.web.article.copyright']}">采用 知识共享署名4.0
												国际许可协议进行许可
												本站文章除注明转载/出处外，均为本站原创或翻译，转载前请务必署名</span></li>
									</ul>
								</div>
							</fieldset>
						</div>
					</div>
					<div class="layui-col-md12 post-comment"
						th:with="supportComment=${#strings.equals('true',@commentTag.commentSupport('ARTICLE'))&&#strings.equals('true',article.allowComment)}">
						<fieldset th:if="${supportComment}" class="layui-elem-field layui-field-title">
							<legend>评论</legend>
							<div class="layui-field-box"
								th:with="comments=${@commentTag.pageCommentByTypeId(article.articleId,1,10)}"
								id="commentContent">
								<div class="layui-row">
									<div class="layui-col-md12">
										<button type="button"
											class="layui-btn layui-btn-primary layui-border-black  comment-ok reply-ok"
											th:data-comment="${0+','+article.articleId+','+''}" title="评论"><i
												class="layui-icon layui-icon-reply-fill"
												aria-hidden="true"></i></button>
									</div>
									<div class="layui-col-md12 post-comment-list">
										<ul>
											<li th:each="commentOne,commentOneStat:${comments.rows}">
												<div class="comment-parent">
													<section
														th:with="user=${commentOne.fromUser}">
														<div class="comment-head">
															<a class="comment-name" href="javaScript:void(0)"
																rel="nofollow"><img th:src="${user.avatar}"><br />
																<span th:utext="${user.userName}">博主大大请问你的</span>
															</a>
															<span class="comment-ua"
																th:text="${commentOne.userBower}">Ip</span>
															<span class="comment-index"
																th:text="${(commentOneStat.index+1)+(comments.pageNum-1)*comments.pageSize}+'楼'">1楼</span>
														</div>
														<br />
														<div class="comment-content">
															<div th:utext="${commentOne.content}">九九九</div>
														</div>
														<div class="comment-footer">
															<span class="footer-time layui-text"
																th:text="${#dates.format(commentOne.createTime,'yyyy-MM-dd HH:mm')}">2019-05-17
																08:52</span>

															<!--回复需要文章id,评论id,用户id-->
															<div class="layui-btn-group footer-reback comment-ok">
																<button type="button"
																	class="layui-btn layui-btn-sm layui-btn-primary layui-border-black reply-ok"
																	th:data-comment="${commentOne.commentId+','+commentOne.typeId+','+commentOne.fromBy}"
																	title="回复"><i
																		class="layui-icon layui-icon-reply-fill"
																		aria-hidden="true"></i></button>
																<button type="button"
																	class="layui-btn layui-btn-sm layui-btn-primary layui-border-black reply-like"
																	th:data-comment_id="${commentOne.commentId}"
																	title="赞"><i
																		class="layui-icon layui-icon-praise"></i></button>
																<button type="button"
																	class="layui-btn layui-btn-sm layui-btn-primary layui-border-black reply-nasty"
																	th:data-comment_id="${commentOne.commentId}"
																	title="踩"><i
																		class="layui-icon layui-icon-tread"></i></button>
															</div>
														</div>
													</section>
													<hr>
												</div>
												<div class="comment-child"
													th:with="childrenData=${commentOne.getChildPage}">
													<ul>
														<li th:each="commentTwo,commentTwoStat:${childrenData.rows}">
															<section
																th:with="user=${commentTwo.fromUser}">
																<div class="comment-head">
																	<a class="comment-name" href="javaScript:void(0)"
																		rel="nofollow"><img
																			th:src="${user.avatar}"><br />
																		<span
																			th:utext="${user.userName}">博主大大请问你的</span>
																	</a>
																	<span class="comment-ua"
																		th:text="${commentTwo.userBower}">Ip</span>
																	<span class="comment-index">
																		<span
																			th:text="${(commentTwoStat.index+1)+(childrenData.pageNum-1)*childrenData.pageSize}+'#'"></span>
																	</span>
																</div>
																<br />
																<div class="comment-content">
																	<span>回复@<a
																			th:with="user2=${commentTwo.replyUser}"
																			href="javaScript:void(0)"
																			th:text="${user2.userName}"></a>：</span><span
																		th:utext="${commentTwo.content}">九九九</span>
																</div>
																<div class="comment-footer">
																	<span class="footer-time layui-text"
																		th:text="${#dates.format(commentTwo.createTime,'yyyy-MM-dd HH:mm')}">2019-05-17
																		08:52</span>
																	<div
																		class="layui-btn-group footer-reback comment-ok">
																		<button type="button"
																			class="layui-btn layui-btn-sm layui-btn-primary layui-border-black reply-ok"
																			th:data-comment="${commentTwo.parentId+','+commentTwo.typeId+','+commentTwo.fromBy}"
																			title="回复"><i
																				class="layui-icon layui-icon-reply-fill"
																				aria-hidden="true"></i></button>
																	</div>
																</div>
															</section>
															<hr>
														</li>
													</ul>
													<div class="layui-box layui-laypage layui-laypage-default"
														th:if="${childrenData.pages>1}">
														<a href="javascript:void(0)" class="page-this"
															th:onclick="javascript:getTwoPage([[${commentOne.commentId}]], [[${comments.pageNum-1}]],2,this)"
															th:if="${childrenData.pageNum>1}"><i
																class="layui-icon layui-icon-prev"
																aria-hidden="true"></i></a>
														<a href="javascript:void(0)" class="page-this"
															th:onclick="javascript:getTwoPage([[${commentOne.commentId}]], [[${comments.pageNum+1}]],2,this)"
															th:if="${childrenData.pages>childrenData.pageNum}"><i
																class="layui-icon layui-icon-next"
																aria-hidden="true"></i></a>
													</div>
												</div>
											</li>
										</ul>
										<div class="layui-box layui-laypage layui-laypage-default"
											th:if="${comments.pages>1}">
											<a href="javascript:void(0)" class="page-this"
												th:onclick="javascript:getOnePage([[${article.articleId}]], [[${comments.pageNum-1}]],2)"
												th:if="${comments.pageNum>1}"><i class="layui-icon layui-icon-prev"
													aria-hidden="true"></i></a>
											<a href="javascript:void(0)" class="page-this"
												th:onclick="javascript:getOnePage([[${article.articleId}]], [[${comments.pageNum+1}]],2)"
												th:if="${comments.pages>comments.pageNum}"><i
													class="layui-icon layui-icon-next" aria-hidden="true"></i></a>
										</div>
									</div>
								</div>
							</div>
						</fieldset>
						<fieldset th:if="${!supportComment}" class="layui-elem-field layui-field-title">
							文章评论已关闭！
						</fieldset>
					</div>
				</div>
			</article>
		</div>
	</div>
</div>

<!-- 分类列表 nodeType 标签 -->
<div th:fragment=blogCategories(nodeType)>
	<div class="layui-row" th:switch="${nodeType}">
		 <th:block th:case="CLASSIFY_TRUCK" th:include="zgblog/blog_include::blogCategoryNodeClassify()" />
		 <th:block th:case="CLASSIFY" th:include="zgblog/blog_include::blogCategoryNodeClassify()" />
		 <th:block th:case="TAG_TRUCK" th:include="zgblog/blog_include::blogCategoryNodeTag()" />
		 <th:block th:case="TAG" th:include="zgblog/blog_include::blogCategoryNodeTag()" />
	</div>
</div>

<!-- 分类列表 nodeType 标签 -->
<div th:fragment=blogCategoryNodeTag()>
		<div class="layui-col-md12 zgblog-box">
			<div class="layui-card-body" style="background-color: white;">
				<fieldset class="layui-elem-field" style="padding: 10px">
					<legend>标签列表</legend>
					<div class="layui-row layui-col-space10">
						<div class="layui-col-xs6 layui-col-sm6 layui-col-md3" th:each="category:${@categoryTag.listCmsCategory('TAG_TRUCK','zgblog')}">
							<blockquote class="layui-elem-quote" style="padding:10px;"> <a
									th:href="${blogConfig['oly.web.domain']+'/category/'+category.categoryId}"
									th:text="${category.categoryName+'('+category.categoryPassCount+')'}"></a></blockquote>
						</div>
					</div>
				</fieldset>
			</div>
		</div>
</div>

<!-- 分类列表 nodeType 分类 -->
<div th:fragment=blogCategoryNodeClassify()>
		<div class="layui-col-md12 zgblog-box">
			<div class="layui-card-body" style="background-color: white;">
				<fieldset class="layui-elem-field" style="padding: 10px">
					<legend>分类列表</legend>
					<div class="layui-row layui-col-space10">
						<div class="layui-col-xs6 layui-col-sm6 layui-col-md3" th:each="category:${@categoryTag.listCmsCategory('CLASSIFY_TRUCK','zgblog')}">
							<blockquote class="layui-elem-quote" style="padding:10px;"> <a
									th:href="${blogConfig['oly.web.domain']+'/category/'+category.categoryId}"
									th:text="${category.categoryName+'('+category.categoryPassCount+')'}"></a></blockquote>
						</div>
					</div>
				</fieldset>
			</div>
		</div>
</div>

<!-- 分类查询文章列表 -->
<div th:fragment=blogArticlesByCategory(category,articles)>
	<div class="layui-row">
		<div class="layui-col-md12 zgblog-box">
			<div class="zgblog-posts">
				<fieldset class="layui-elem-field" style="min-height: 80vh;">
					<legend th:text="'分类：'+${category.categoryName+'('+category.categoryPassCount+')'}"></legend>
					<div class="layui-row" th:if="${articles!=null}">
						<th:block th:include="zgblog/blog_include::blogItemArticle(articles=${articles.rows})" />
						<div class="layui-col-md12 zgblog-post-page" style=" text-align: center;"
							th:if="${articles.total>0}">
							<div class="layui-box layui-laypage layui-laypage-default" th:if="${articles.pages>1}">
								<a th:href="${blogConfig['oly.web.domain']+'/category/'+category.categoryId+'?pageNum='+(articles.pageNum-1)}" class="page-this"
									th:if="${articles.pageNum>1}"><i class="layui-icon layui-icon-prev"
										aria-hidden="true"></i></a>
								<a th:href="${blogConfig['oly.web.domain']+'/category/'+category.categoryId+'?pageNum='+(articles.pageNum+1)}" class="page-this"
									th:if="${articles.pages>articles.pageNum}"><i class="layui-icon layui-icon-next"
										aria-hidden="true"></i></a>
							</div>
						</div>
					</div>
				</fieldset>
			</div>
		</div>
	</div>
</div>

<!-- 关于本站 -->
<div th:fragment=blogAbout(blogConfig)>
	<div class="layui-row">
		<div class="layui-col-md12 zgblog-box">
			<ul class="layui-timeline zgblog-about-box" style="background-color: white">
				<li class="layui-timeline-item">
					<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
					<div class="layui-timeline-content layui-text">
						<h3 class="layui-timeline-title">本站作者</h3>
						<div th:utext="${blogConfig['oly.web.aboutAuthor']}">
						</div>
					</div>
				</li>
				<li class="layui-timeline-item">
					<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
					<div class="layui-timeline-content layui-text">
						<h3 class="layui-timeline-title">关于本站</h3>
						<div th:utext="${blogConfig['oly.web.aboutSite']}">
						</div>
					</div>
				</li>
				<li class="layui-timeline-item">
					<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
					<div class="layui-timeline-content layui-text">
						<h3 class="layui-timeline-title">关于作者</h3>
						<div th:utext="${blogConfig['oly.web.aboutAuthor']}">
						</div>
					</div>
				</li>
				<li class="layui-timeline-item">
					<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
					<div class="layui-timeline-content layui-text">
						<h3 class="layui-timeline-title">个人主页</h3>
						<div th:utext="${blogConfig['oly.web.authorIndex']}">
						</div>
					</div>
				</li>
				<li class="layui-timeline-item">
					<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
					<div class="layui-timeline-content layui-text">
						<h3 class="layui-timeline-title">联系方式</h3>
						<div th:utext="${blogConfig['oly.web.authorCall']}">
						</div>
					</div>
				</li>
				<li class="layui-timeline-item">
					<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
					<div class="layui-timeline-content layui-text">
						<h3 class="layui-timeline-title"></h3>
					</div>
				</li>
			</ul>
		</div>
	</div>
</div>

<!-- 文章项目 -->
<div th:fragment=blogItemArticle(articles)>
	<div th:each="article,articleStat:${articles}"
		th:class="'layui-col-md4 layui-col-sm6 zgblog-post-list '+${'post-page-'+(1+articleStat.index/18)}">
		<div class="post-list-item">
			<div class="post-list-item-container">
				<div class="item-thumb  bg-deepgrey"
					th:with="imgs=${@commonTag.split(article.articleImg==null?'':article.articleImg)},rando=${#numbers.formatDecimal(T(java.lang.Math).floor(T(java.lang.Math).random()*10),1,0)},iul=@{/static/zgblog/images/thumbs/}"
					th:style="'background-image:url('+${(imgs==null)?(iul+rando+'.jpg'):imgs[0]}+')'">
				</div>
				<div class="item-desc">
					<a th:href="${blogConfig['oly.web.domain']+'/article/'+article.articleId}">
						<p th:text="${article.articleSummary}">产生原因最近做一简单的缓存，使用到springcache框架，集成EhCache。其间多方面努力解决</p>
					</a> <br> <br>
					<p class="post-tags" th:if="${!#lists.isEmpty(article.mapCategory['tag'])}">
						<a th:each="tag:${article.mapCategory['tag']}"  th:href="${blogConfig['oly.web.domain']+'/category/'+tag.categoryId}"
							th:text="${tag.categoryName}">产生原因 </a>
					</p>
				</div>
				<div class="item-slant reverse-slant  bg-deepgrey"></div>
				<div class="item-slant reverse-slant  bg-deepgrey"></div>
				<div class="item-slant"></div>
				<div class="item-label">
					<div class="item-title">
						<a th:href="${blogConfig['oly.web.domain']+'/article/'+article.articleId}"
							th:text="${article.articleTitle}">Spring
							Cache注解无效：可能是类内方法调用注解缓存的方法</a>
					</div>
					<div class="item-meta clearfix">
						<div class="item-meta-info">
							<span> <i class="layui-icon ayui-icon-reply-fill" style="color: #1E9FFF;"></i> <span
									th:text="${#dates.format(article.createTime,'yyyy-MM-dd HH:mm')}"></span>
							</span> <span> <i class="layui-icon layui-icon-read l" style="color: #1E9FFF;"></i>
								<span&nbsp; th:text="${article.articleCount==null?0:article.articleCount.articleLook}">
							</span>
							</span>
						</div>

						<div class="item-meta-cat" th:if="${!#lists.isEmpty(article.mapCategory['classify'])}">
							<a th:each="category:${article.mapCategory['classify']}" 
								th:href="${blogConfig['oly.web.domain']+'/category/'+category.categoryId}"
								th:text="${category.categoryName}">产生原因 </a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- 时间线 -->
<div th:fragment=blogArticleTimeLine(timeData)>
	<div class="layui-row" style="background-color: white">
		<div class="layui-col-md12">
			<ul class="layui-timeline zgblog-about-box">
				<li class="layui-timeline-item" th:each="postMap,articleStat:${timeData.map}">
					<i class="layui-icon layui-timeline-axis">&#xe63f;</i>
					<div class="layui-timeline-content layui-text layui-row">
						<h3 class="layui-timeline-title" th:text="${articleStat.current.key}">关于本站</h3>
						<th:block th:include="zgblog/blog_include::blogItemArticle(articles=${articleStat.current.value})" />
					</div>
				</li>
			</ul>
		</div>
		<div class="layui-col-md12" th:with="cr=${crTime==null?'':'?crTime='+crTime},pageSize=${pageSize==null?20:pageSize}">
			<div class="layui-box layui-laypage layui-laypage-default" style="margin-left: 100px"
				th:if="${timeData.pages>1}">
				<a th:if="${timeData.pages>6}" th:href="${blogConfig['oly.web.domain']+'/timeLine/page/1'+'/'+pageSize+cr}">首页</a>
				<!--显示1-5页 页数少于5页-->
				<a th:if="${timeData.pages<6}" th:each="i:${#numbers.sequence(1,timeData.pages)}" th:text="${i}"
					th:href="${blogConfig['oly.web.domain']+'/timeLine/page/'+i+'/'+pageSize+cr}"
					th:style="${(i==timeData.pageNum)}?'color:#1E9FFF':''"></a>
				<!--显示中间页 页数大于5页-->
				<a th:if="${timeData.pages>5 and timeData.pageNum<4}" th:each="i:${#numbers.sequence(1,5)}"
					th:text="${i}" th:href="${blogConfig['oly.web.domain']+'/timeLine/page/'+i+'/'+pageSize+cr}"
					th:style="${(i==timeData.pageNum)}?'color:#1E9FFF':''"></a>
				<a th:if="${timeData.pages>5 and (timeData.pages-timeData.pageNum)>5 and timeData.pageNum>3}"
					th:each="i:${#numbers.sequence(timeData.pageNum-2,timeData.pageNum+2)}" th:text="${i}"
					th:href="${blogConfig['oly.web.domain']+'/timeLine/page/'+i+'/'+pageSize+cr}"
					th:style="${(i==timeData.pageNum)}?'color:#1E9FFF':''"></a>
				<!--显示最后5页 页数大于5页-->
				<a th:if="${timeData.pageNum>3 and (timeData.pages-timeData.pageNum)<6 and (timeData.pages-timeData.pageNum)>2 }"
					th:each="i:${#numbers.sequence(timeData.pageNum-2,timeData.pageNum+2)}" th:text="${i}"
					th:href="${blogConfig['oly.web.domain']+'/timeLine/page/'+i+'/'+pageSize+cr}"
					th:style="${(i==timeData.pageNum)}?'color:#1E9FFF':''"></a>
				<!--最后页面-->
				<a th:if="${timeData.pages>5 and (timeData.pages-timeData.pageNum)<3}"
					th:each="i:${#numbers.sequence(timeData.pages-4,timeData.pages)}" th:text="${i}"
					th:href="${blogConfig['oly.web.domain']+'/timeLine/page/'+i+'/'+pageSize+cr}"
					th:style="${(i==timeData.pageNum)}?'color:#1E9FFF':''"></a>
				<a th:if="${timeData.pages>6}"
					th:href="${blogConfig['oly.web.domain']+'/timeLine/page/'+timeData.pages+'/'+pageSize+cr}">尾页</a>
			</div>
		</div>
	</div>
</div>

<!-- 热门分类 -->
<div th:fragment=blogHotCategory(categories)>
	<div class="tagcloud">
		<a th:each="category:${categories}" th:href="${blogConfig['oly.web.domain']+'/category/'+category.categoryId}"
			th:text="${category.categoryName}"></a>
	</div>
</div>

<!-- 通用右侧 -->
<div th:fragment=blogRightCommon()>
	<div class="layui-row" style="margin-left: 10px;">
		
		<div class="layui-col-md12">
				<div class="layui-card" style="padding: 20px;text-align: center;">
				<div class="layui-row layui-col-space10">
					<div class="layui-col-md12 layui-col-sm12 layui-col-xs12">
					<div class="text-center layui-text">
				      <div class="user-info-head" id="userInfoHead">
				        <img th:src="${blogConfig['oly.web.logo']}" style="border-radius:115px" height="115px" alt="">
				       </div>
				    <h2 style="padding-top: 20px;font-size: 20px;" th:text="${blogConfig['oly.web.title']}" >就眠仪式</h2>
				    <p style="padding-top: 8px;margin-top: 10px;font-size: 13.5px;"><i class="layui-icon layui-icon-location" ></i>     China ， 中国</p>
				</div>	                     
					</div>
				<div class="layui-col-md3 layui-col-sm3 layui-col-xs3">
					<div class="shortcut-menu" >
						<i class="layui-icon layui-icon-note" title="标签数"></i>
					</div>
					<span class="shortcut-menu-label" th:text="${@categoryTag.selectCategoryNum('zgblog','TAG')}">标签数</span>
				</div>
				<div class="layui-col-md3 layui-col-sm3 layui-col-xs3">
					<div class="shortcut-menu" >
						<i class="layui-icon layui-icon-template-1" title="分类数" ></i>
					</div>
					<span class="shortcut-menu-label" th:text="${@categoryTag.selectCategoryNum('zgblog','CLASSIFY')}">分类</span>
				</div>
				<div class="layui-col-md3 layui-col-sm3 layui-col-xs3">
					<div class="shortcut-menu" >
						<i class="layui-icon layui-icon-read" title="文章数"></i>
					</div>
					<span class="shortcut-menu-label" th:text="${@articleTag.selectArticleNum('zgblog')}" >文章数</span>
				</div>
				<div class="layui-col-md3 layui-col-sm3 layui-col-xs3">
					<div class="shortcut-menu" >
						<i class="layui-icon layui-icon-flag" title="访问量"></i>
					</div>
					<span class="shortcut-menu-label">访问量</span>
				</div>
				<div class="layui-col-md12 layui-col-sm12 layui-col-xs12">
					<div class="shortcut-menu">
						<button type="button" class="layui-btn layui-btn-primary layui-btn-radius layui-border-black  layui-btn-fluid">关注</button>
					</div>
				</div>									
				<div class="layui-col-md12 layui-col-sm12 layui-col-xs12">
					<div class="layui-btn-container">
					  <button type="button" class="layui-btn layui-btn-bor layui-btn-sm layui-btn-primary">
					    <i class="layui-icon layui-icon-login-qq"></i>
					  </button>
					  <button type="button" class="layui-btn layui-btn-bor layui-btn-sm layui-btn-primary">
					    <i class="layui-icon layui-icon-login-wechat"></i>
					  </button>
					  <button type="button" class="layui-btn layui-btn-bor layui-btn-sm layui-btn-primary">
					    <i class="layui-icon layui-icon-login-weibo"></i>
					  </button>
					  <button type="button" class="layui-btn layui-btn-bor layui-btn-sm layui-btn-primary">
					    <i class="layui-icon layui-icon-cellphone"></i>
					  </button>
					  <button type="button" class="layui-btn layui-btn-bor layui-btn-sm layui-btn-primary">
					    <i class="layui-icon layui-icon-website"></i>
					  </button>
					  </div>
					  <hr class="layui-border-cyan">
				</div>
	
				<div class="layui-col-md12 layui-col-sm12 layui-col-xs12">
					<div class="shortcut-menu" data-id="home7" data-title="更多" data-url="http://www.baidu.com">
						<i class="layui-icon layui-icon-app"></i>
					</div>
					<span class="shortcut-menu-label">更多</span>
				</div>									
				</div>
				</div>
		</div>
		
			

		<div class="layui-col-md12">
			<div class="layui-tab layui-tab-brief">
				<ul class="layui-tab-title" style="text-align: center">
					<li class="layui-this">最新发布</li>
					<li>文章推荐</li>
				</ul>
				<div class="layui-tab-content">
					<div class="layui-tab-item layui-card-body layui-show">
						<th:block
							th:include="zgblog/blog_include::blogArticleSortText(articles=${@articleCountSortTag.listWebArticleOrder(1,@configTag.getKeyDefault('zgblog','oly.web.theme.zgblog.article.now',10),'zgblog','TIME','DESC')})" />
					</div>
					<div class="layui-tab-item layui-card-body">
						<th:block
							th:include="zgblog/blog_include::blogArticleSortText(articles=${@articleCountSortTag.listWebArticleOrder(1,@configTag.getKeyDefault('zgblog','oly.web.theme.zgblog.article.top',10),'zgblog','TOP','DESC')})" />
					</div>
				</div>
			</div>
		</div>

		<div class="layui-col-md12">
			<div class="layui-card">
				<div class="layui-card-header">阅读排行</div>
				<div class="layui-card-body" id="side_con">
					<th:block 
						th:include="zgblog/blog_include::blogArticleSortImg(articles=${@articleCountSortTag.listWebArticleOrder(1,@configTag.getKeyDefault('zgblog','oly.web.theme.zgblog.article.look',1),'zgblog','LOOK','DESC')})" />
				</div>
			</div>
		</div>

		<div class="layui-col-md12">
			<div class="layui-tab" >
				<ul class="layui-tab-title" style="text-align: center">
					<li class="layui-this">推荐分类</li>
					<li >推荐标签</li>
				</ul>
				<div class="layui-tab-content" style="overflow:hidden;">
					<div class="layui-tab-item layui-show" >
						<th:block
							th:include="zgblog/blog_include::blogHotCategory(categories=${@categoryTag.listCmsCategory('CLASSIFY','zgblog')})" />
					</div>
					<div class="layui-tab-item" >
						<th:block
							th:include="zgblog/blog_include::blogHotCategory(categories=${@categoryTag.listCmsCategory('TAG','zgblog')})" />
					</div>
	
				</div>
			</div>
		</div>

	</div>
</div>

<!-- 友情链接 tree-->
<div th:fragment=blogLinks(linkTree)>
	<div class="layui-row">
		<div class="layui-col-md12 zgblog-box">
			<div class="layui-card">
				<div class="layui-card-header">止戈导航</div>
				<div class="layui-row">
					<div class="layui-col-md12" th:each="link:${linkTree}">
						<div class="layui-card-body">
							<div class="layui-card-header" th:text="${link.linkName}">止戈导航</div>
						    <th:block th:include="zgblog/blog_include::blogLinkList(links=${link.children})" />
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- 友情链接 list-->
<div th:fragment=blogLinkList(links)>
	<div class="layui-row  layui-col-space15">
		<div class="layui-col-md3  layui-col-sm3 layui-col-xs4"
			 th:each="child:${links}">
				<div class="zgblog-link-box" >
					<a th:href="${blogConfig['oly.web.domain']+'/link/'+child.linkId}" title="APPannie" target="_blank">
						<img th:src="${child.linkIco}" alt="SEO优化"  title="SEO优化">
						<h3  ><span th:if="${child.orderNum==1}" style="color:red;margin-right: 3px;">[顶]</span><span th:text="${child.linkName}"></span></h3>	
						<p th:text="${child.description}" class="marquee">北京七星贝网络营销公司专注整站优化,SEO排名,品牌营销推广服务,对企业网站建站,网站优化,快速提升关键词排名,网站权重,北京SEO优化外包服务公司,精准定位客户,助力企业线上营销推广,轻松引流获客....</p>
					</a>
					<div class="zgblog-link-go">
						<a  target="_blank" th:href="${child.linkUrl}" rel="nofollow">
							<i class="autoleft fa fa-share" title="直达链接"></i>
						</a>
					</div>
				</div>
		</div>
	</div>
</div>

<!-- 友情链接 主题信息-->
<div th:fragment=blogLinkInfo(link)>
	<div class="layui-row">
		<div class="layui-col-md12 zgblog-box">
	    <div class="layui-card">
		<div class="layui-row" style="font-size: 20px;">
		<div class="layui-col-md12" style="line-height:35px ;margin-top: 40px;">
			<img th:src="${link.linkIco}" style="border-radius: 10%;float: left;width: 200px;height: 200px;margin: 10px;">
			<h2 th:text="${link.linkName}" style="margin-top: 20px;"></h2>
			<p>所属分类: <span th:text="${@linkTag.getLinkById(link.parentId).linkName}"></span></p>
			<p>网站地址:<span th:text="${link.linkUrl}"></span></p>
		    <p>关键词:<span th:text="${link.keywords}"></span></p>
			<p><a class="layui-btn layui-btn-normal layui-btn-sm" th:href="${link.linkUrl}">点击进入</a></p>
		</div>
		<div class="layui-col-md12 " style="line-height:35px ;margin-top: 40px;">
			<fieldset class="layui-elem-field layui-field-title">
			  <legend>站点介绍</legend>
			</fieldset>
			<div class="layui-field-box">
			  <p th:text="${link.description}"></p>
			</div>
		</div>
		
		<div class="layui-col-md12 " style="line-height:35px ;margin-top: 40px;">
			<fieldset class="layui-elem-field layui-field-title">
			  <legend>相关网站</legend>
			</fieldset>
			<div class="layui-field-box">
				<th:block th:include="zgblog/blog_include::blogLinkList(links=${@linkTag.listLink(link.parentId,'blog_link')})" />
			</div>
		</div>
		
		</div>
    </div>

	</div>
	
	</div>
</div>